- use even sides for the titlebuttons so the result is a circle and not an ellipse
- add maximum border radius
- set min width/height to 0
- adjust margin and padding to match the previous look
@include _button_text_shadow;
+ border-radius: 9999px;
+ padding: 6px;
+ margin: 0 2px;
+ min-width: 0;
+ min-height: 0;
+
.selection-mode & {
@extend %button.flat.suggested-action;
.solid-csd decoration:backdrop { box-shadow: inset 0 0 0 3px #353535, inset 0 1px rgba(238, 238, 236, 0.07); }
-button.titlebutton { text-shadow: 0 -1px rgba(0, 0, 0, 0.834353); -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.834353); }
+button.titlebutton { text-shadow: 0 -1px rgba(0, 0, 0, 0.834353); -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.834353); border-radius: 9999px; padding: 6px; margin: 0 2px; min-width: 0; min-height: 0; }
button.titlebutton:backdrop { -gtk-icon-shadow: none; }
.solid-csd decoration:backdrop { box-shadow: inset 0 0 0 3px #f6f5f4, inset 0 1px rgba(255, 255, 255, 0.8); }
-button.titlebutton { text-shadow: 0 1px rgba(255, 255, 255, 0.769231); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.769231); }
+button.titlebutton { text-shadow: 0 1px rgba(255, 255, 255, 0.769231); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.769231); border-radius: 9999px; padding: 6px; margin: 0 2px; min-width: 0; min-height: 0; }
button.titlebutton:backdrop { -gtk-icon-shadow: none; }